<template>
    <ui-main :title="$route.name">

        <!--组件示例-->
        <ui-bigDataTable :tableData="tableData">
            <template v-slot="{ vdata }">
                <el-table :data="vdata" style="width: 100%" height="250">
                    <el-table-column fixed prop="date" label="日期" width="150"></el-table-column>
                    <el-table-column prop="name" label="姓名" width="120"></el-table-column>
                    <el-table-column prop="province" label="省份" width="120"></el-table-column>
                    <el-table-column prop="city" label="市区" width="120"></el-table-column>
                    <el-table-column prop="address" label="地址" width="300"></el-table-column>
                    <el-table-column prop="zip" label="邮编" width="120"></el-table-column>
                </el-table>
            </template>
        </ui-bigDataTable>
        <el-popover placement="top" width="160" v-model="visible">
            <p>这是一段内容这是一段内容确定删除吗？</p>
            <div style="text-align: right; margin: 0">
                <el-button size="mini" type="text" @click="visible = false">取消</el-button>
                <el-button type="primary" size="mini" @click="visible = false">确定</el-button>
            </div>
            <el-button size="mini" slot="reference">xxxxxxx</el-button>
        </el-popover>
        <!--说明文档-->
        <!--<ui-load-md file="bigDataTable"></ui-load-md>-->
    </ui-main>
</template>
<script>
    export default {
        data() {
            return {
                visible:false,
                tableData: []
            }
        },
        mounted() {

            for (let i = 0, len = 10; i < len; i++) {
                this.tableData.push({
                    date: '2016-05-03',
                    name: '王小虎' + i,
                    province: '上海',
                    city: '普陀区',
                    address: '上海市普陀区金沙江路 1518 弄',
                    zip: 200333
                })
            }
            /*setTimeout(() => {
                for (let i = 0, len = 20; i < len; i++) {
                    this.tableData.push(this.tableData[0])
                }
            },1000)*/
        },
        methods: {
            name() {

            }
        }
    }
</script>
